<% @page_title = @firewall.name

attachable_subnets = dataset_authorize(@project
    .private_subnets_dataset
    .eager(:location)
    .where(location_id: @location.id),
  "PrivateSubnet:view")
  .exclude(id: @firewall.private_subnets_dataset.select(:id))
  .all

firewall_path = "#{@project_data[:path]}#{@firewall.path}"
edit_perm = has_permission?("Firewall:edit", @firewall.ubid) %>

<%== part(
  "components/page_header",
  breadcrumbs: [
    %w[Projects /project],
    [@project_data[:name], @project_data[:path]],
    ["Firewall", "#{@project_data[:path]}/firewall"],
    [@firewall.name, "#"]
  ]
) %>

<div class="grid gap-6">
  <!-- Detail Card -->
  <%== part(
    "components/kv_data_card",
    data: [
      ["ID", @firewall.ubid],
      ["Name", @firewall.name],
      ["Location", @firewall.display_location],
      ["Description", @firewall.description]
    ]
  ) %>
  <div class="md:flex md:items-center md:justify-between pb-2 lg:pb-4">
    <div class="min-w-0 flex-1">
      <h3 class="text-2xl font-bold leading-7 text-gray-900 sm:truncate sm:text-2xl sm:tracking-tight">
        Firewall Rules
      </h3>
    </div>
  </div>
  <div class="overflow-hidden rounded-lg shadow ring-1 ring-black ring-opacity-5 bg-white divide-y divide-gray-200">
    <table class="min-w-full divide-y divide-gray-300">
      <thead class="bg-gray-50">
        <tr>
          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">CIDR</th>
          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Port range</th>
          <% if edit_perm %>
            <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"></th>
          <% end %>
        </tr>
      </thead>
      <tbody class="divide-y divide-gray-200 bg-white">
        <% @firewall.firewall_rules.sort_by { [it.cidr.version, it.cidr.to_s] }.each do |fwr| %>
          <tr>
            <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row"><%= fwr.cidr %></td>
            <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row"><%= fwr.display_port_range %></td>
            <% if edit_perm %>
              <td
                id="fwr-delete-<%= fwr.ubid %>"
                class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6"
              >
                <%== part("components/delete_button", url: "#{firewall_path}/firewall-rule/#{fwr.ubid}", text: "") %>
              </td>
            <% end %>
          </tr>
        <% end %>
        <% if edit_perm %>
          <tr>
            <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row">
              <%== part(
                "components/form/text",
                name: "cidr",
                attributes: {
                  placeholder: "0.0.0.0/0",
                  required: true,
                  form: "form-fw-create-rule-#{@firewall.ubid}"
                }
              ) %>
            </td>
            <td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row">
              <%== part(
                "components/form/text",
                name: "port_range",
                attributes: {
                  placeholder: "0..65536",
                  form: "form-fw-create-rule-#{@firewall.ubid}"
                }
              ) %>
            </td>
            <td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
              <form
                action="<%= "#{firewall_path}/firewall-rule" %>"
                role="form"
                method="POST"
                id="form-fw-create-rule-<%= @firewall.ubid %>"
              >
                <%== csrf_tag("#{firewall_path}/firewall-rule") %>
                <%== part("components/form/submit_button", text: "Create") %>
              </form>
            </td>
          </tr>
        <% end %>
      </tbody>
    </table>
  </div>
  <div class="md:flex md:items-center md:justify-between pb-2 lg:pb-4">
    <div class="min-w-0 flex-1">
      <h3 class="text-2xl font-bold leading-7 text-gray-900 sm:truncate sm:text-2xl sm:tracking-tight">
        Attached Private Subnets
      </h3>
    </div>
  </div>
  <div class="overflow-hidden rounded-lg shadow ring-1 ring-black ring-opacity-5 bg-white divide-y divide-gray-200">
    <table class="min-w-full divide-y divide-gray-300">
      <thead class="bg-gray-50">
        <tr>
          <th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6">Name</th>
          <% if edit_perm %>
            <th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900"></th>
          <% end %>
        </tr>
      </thead>
      <tbody class="divide-y divide-gray-200 bg-white">
        <% @firewall.private_subnets.each do |ps| %>
          <tr>
            <td class="whitespace nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row">
              <a
                href="<%= "#{@project_data[:path]}/location/#{ps.display_location}/private-subnet/#{ps.name}" %>"
                class="text-orange-600 hover:text-orange-700"
              ><%= ps.name %></a>
            </td>
            <% if edit_perm %>
              <td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
                <form action="<%= "#{firewall_path}/detach-subnet" %>" role="form" method="POST">
                  <%== csrf_tag("#{firewall_path}/detach-subnet") %>
                  <input type="hidden" name="private_subnet_id" value="<%= ps.ubid %>">
                  <%== part("components/form/submit_button", text: "Detach") %>
                </form>
              </td>
            <% end %>
          </tr>
        <% end %>
        <% if edit_perm %>
          <tr>
            <td class="whitespace-nowrap py-4 pl-2 pr-3 text-sm font-medium text-gray-900 sm:pl-6" scope="row">
              <%== part(
                "components/form/select",
                name: "private_subnet_id",
                placeholder: "Select a subnet",
                options: attachable_subnets.map { [it.ubid, it.name] },
                attributes: {
                  required: true,
                  form: "form-fw-attach-#{@firewall.ubid}"
                }
              ) %>
            </td>
            <td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
              <form
                action="<%= "#{firewall_path}/attach-subnet" %>"
                role="form"
                method="POST"
                id="form-fw-attach-<%= @firewall.ubid %>"
              >
                <%== csrf_tag("#{firewall_path}/attach-subnet") %>
                <%== part("components/form/submit_button", text: "Attach") %>
              </form>
            </td>
          </tr>
        <% end %>
      </tbody>
    </table>
  </div>
  <!-- Delete Card -->
  <% if has_permission?("Firewall:delete", @firewall.ubid) %>
    <div class="overflow-hidden rounded-lg shadow ring-1 ring-black ring-opacity-5 bg-white divide-y divide-gray-200">
      <div class="px-4 py-5 sm:p-6">
        <div class="sm:flex sm:items-center sm:justify-between">
          <div>
            <h3 class="text-base font-semibold leading-6 text-gray-900">Delete firewall</h3>
            <div class="mt-2 text-sm text-gray-500">
              <p>This action will permanently delete this firewall. Deleted firewall cannot be recovered. Use it
                carefully.</p>
            </div>
          </div>
          <div class="mt-5 sm:ml-6 sm:mt-0 sm:flex sm:flex-shrink-0 sm:items-center">
            <%== part("components/delete_button", confirmation: @firewall.name, redirect: "#{@project_data[:path]}/firewall") %>
          </div>
        </div>
      </div>
    </div>
  <% end %>
</div>
